use leptos::prelude::*;

/// Button Component
#[component]
#[must_use]
pub fn UiButton(
    #[prop(optional)] class: Option<String>,
    #[prop(optional)] on_click: Option<Callback<()>>,
    children: Children,
) -> impl IntoView {
    let handle_click = move |_| {
        if let Some(cb) = on_click {
            cb.run(());
        }
    };

    // 使用自定义的 r2mo-button 类，并添加默认的主色调样式
    let base = "r2mo-button bg-primary text-white hover:bg-primary-dark focus:ring-primary";
    let class = class.map_or_else(|| base.to_string(), |c| format!("{base} {c}"));

    view! {
        <button
            class=class
            on:click=handle_click
        >
            {children()}
        </button>
    }
}
